/* eslint-disable react/no-unused-state */
import { Component } from 'react'
import { View, Text ,ScrollView} from '@tarojs/components'
import Navbbar from '../../components/Navbbar'
import Searchcard from '../../components/Searchcard'
import Selectcard from '../../components/Selectcard'
import Taro, { getCurrentInstance } from '@tarojs/taro'
import requst from '../../utils/http'
import './index.less'

export default class Detail extends Component {
  // eslint-disable-next-line react/sort-comp
  $instance = getCurrentInstance().router.params
  state = {
    obj:{}
  }
  componentDidMount(){
    var id = this.$instance.id
    var appkey = '12d96537cc4e185f'
    requst(2,'post',`/detail?id=${id}&appkey=${appkey}`,{}).then(res=>{
      this.setState({
        obj:{...res.data.result}
      })
    })
    
  }
  formatTag = (tag='')=>{
    var newarr = tag.split(',').splice(0,2)
    
    return newarr.join(',')
  }
  formatInfo = (info='')=>{
      return info.replace(/\<br\>/g,'\r\n')
  }
  render() {
    return (
      <View>
        <Navbbar type={3}></Navbbar>
        <Searchcard type='s2' pic={this.state.obj.pic} name={this.state.obj.name} peoplenum={this.state.obj.peoplenum} cookingtime={this.state.obj.cookingtime} tag={this.formatTag(this.state.obj.tag)}></Searchcard>
        <Selectcard content={this.formatInfo(this.state.obj.content)} material={this.state.obj.material} process={this.state.obj.process}></Selectcard>    
      </View>
    )
  }
}
